import { createRouter, createWebHistory } from 'vue-router'
const router = createRouter({
    history: createWebHistory(),
    routes: [
        {
            path: '/ws',
            name: 'WebSocketDemo',
            component: () => import('@/views/WebSocketDemo.vue')
        },
        {
            path: '/',
            redirect: '/demo'
        }, {
            path: '/demo',
            name: 'Demo',
            component: () => import('@/views/Demo.vue')
        },
        {
            path: '/home',
            name: 'Home',
            component: () => import('@/views/Home.vue')
        },
        {
            path: '/about',
            name: 'About',
            component: () => import('@/views/About.vue')
        },
        {
            path: '/news',
            name: 'News',
            component: () => import('@/views/News.vue'),
            children: [
                {
                    path: 'detail/:id/:title?',
                    name: 'NewsDetail',
                    component: () => import('@/views/NewsDetail.vue'),
                    // 只对params进行映射
                    // props: true,

                    // 指定参数
                    props: (route) => ({
                        id: route.params.id,
                        title: route.params.title,
                        content: route.query.content + '-query',
                        msg: 'hello'
                    })
                }
            ]
        },{
            path: '/videos',
            name: 'Videos',
            component: () => import('@/views/Videos.vue')
        },{
            path: '/tongxin',
            name: 'TongXin',
            component: ()=> import('@/views/TongXinLayout.vue'),
            children: [
                {
                    path: 'tongxin1',
                    name: 'TongXin1',
                    component: () => import('@/components/tongxin/TongXin1Parent.vue')
                },{
                    path: 'tongxin2',
                    name: 'TongXin2',
                    component: () => import('@/components/tongxin/TongXin2Parent.vue')
                },{
                    path: 'tongxin3',
                    name: 'TongXin3',
                    component: () => import('@/components/tongxin/TongXin3Parent.vue')
                },{
                    path: 'tongxin4',
                    name: 'TongXin4',
                    component: () => import('@/components/tongxin/TongXin4Parent.vue')
                },{
                    path: 'tongxin5',
                    name: 'TongXin5',
                    component: () => import('@/components/tongxin/TongXin5Parent.vue')
                },{
                    path: 'tongxin6',
                    name: 'TongXin6',
                    component: () => import('@/components/tongxin/TongXin6Parent.vue')
                },{
                    path: 'tongxin7',
                    name: 'TongXin7',
                    component: () => import('@/components/tongxin/TongXin7Parent.vue')
                },{
                    path: 'tongxin9',
                    name: 'TongXin9',
                    component: () => import('@/components/tongxin/TongXin9Parent.vue')
                }
            ]
        },{
            path: '/other',
            name: 'Other',
            component: () => import('@/views/Other.vue')
        },{
            path: '/redirectDemo',
            name: 'RedirectDemo',
            component: () => import('@/views/RedirectDemo.vue')
        },{
            path: '/css1',
            name: 'Css1',
            component: () => import('@/views/css/Css1.vue')
        }
    ]
})

export default router
